<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>账号管理</title>
</head>
<link href="<%=basePath %>/js/mobiscroll/style/mobiscroll.2.13.2.css" rel="stylesheet">
<body>
	<jsp:include page="/WEB-INF/page/common/_header.jsp" />
	<script src="<%=basePath %>/js/mobiscroll/script/mobiscroll.2.13.2.js"></script>
	<div id="accountManager" class="accountManager userCenter-list2">
		<form id="accountForm">
			<ul class="clearfix bgfff pl25">
				<li class="clearfix">
					<span class="fl">头像</span>
					<span class="accountManager-headPic fr pr">
						<img id="uploadPic" src="${parent.headImg }">
					</span>
				</li>
				<li class="clearfix">
					<span class="userCenter-list2-left">真实姓名</span>
					<input id="parentName" name="parentName" type="text" value="${parent.parentName }"  placeholder="请输入真实姓名"/>
				</li>
				<li class="clearfix">
					<span class="userCenter-list2-left">昵称</span>
						<input id="nickName" name="nickName" type="text" value="${parent.nickName }"  placeholder="请输入昵称"/>
				</li>
				<li class="clearfix">
					<span class="userCenter-list2-left">性别</span>
					<div class="fl">
						<label class="checkbox <c:if test="${parent.sex == 'F' }">checked</c:if>" data-value="F">男<input name="sex" class="none" type="radio" value="F" <c:if test="${parent.sex == 'M' }">checked</c:if> /></label>
						<label class="checkbox <c:if test="${parent.sex == 'M' }">checked</c:if>" data-value="M">女<input name="sex" class="none" type="radio" value="M" <c:if test="${parent.sex == 'F' }">checked</c:if> /></label>
					</div>
				</li>
				<li class="clearfix">
					<span class="userCenter-list2-left">出生年月</span>
					<input class="accountManager-right" style="width: 65%;" type="text" name="birthday" id="birthday" value="${parent.birthday }" readonly placeholder="请选择出生日期"/>
				</li>
				<li class="clearfix" style="height: 1.8rem;">
					<span class="userCenter-list2-left">手机号码</span>
					<div class="fl pr" style="width: 4.6rem;">
					<input id="parentMobile" name="parentMobile" type="text" value="${parent.parentMobile }" style="
						border-bottom: 1px solid #c1b6b6;
						width: 60%;" placeholder="请输入手机号码"/>
					<c:if test="${parent.isBind == 0 }"><span class="no-bind-tips">未验证</span></c:if>
					<c:if test="${parent.isBind == 1 }"><span class="bind-active">已验证</span></c:if>
					<input type="text" id="validCode" name="validCode" style="
						margin-top: 0;
					    border: 1px solid #f10c5a;
					    border-radius: 2px;
					    width: 41%;
					    padding-left: 10px;"/>
					<input type="text" id="getValidCode" value="获取验证码" readonly="readonly" style="
						margin-top: 0;
					    border-left: 1px solid #f10c5a;
					    border-top: 1px solid #f10c5a;
					    border-bottom: 2px solid #f10c5a;
					    border-right: 2px solid #f10c5a;
					    border-radius: 5px;
					    text-align: center;
					    color: #f10c5a;
					    width: 50%;
					    margin-left: 10px;
					    font-size: 13px;"/>
					</div>
				</li>
			</ul>
			<div class="btnWrap mt150 pb150">
				<span id="regMT-btn" class="btn">保存</span>
			</div>
		</form>
	</div>
	<jsp:include page="/WEB-INF/page/common/_footer.jsp"></jsp:include>
	<script type="text/javascript">
		//日历控件
		function birthday(){
			var currYear = (new Date()).getFullYear();  
			
		  	//初始化日期控件
			var opt = {
				defaultValue:new Date(new Date()),
				//preset: 'date', //日期，可选：date\datetime\time\tree_list\image_text\select
				theme: 'android', //皮肤样式，可选：default\android\android-ics light\android-ics\ios\jqm\sense-ui\wp light\wp
				display: 'modal', //显示方式 ，可选：modal\inline\bubble\top\bottom
				mode: 'scroller', //日期选择模式，可选：scroller\clickpick\mixed
				lang:'zh',
				dateFormat: 'yy-mm-dd', // 日期格式,可选y\yy
				setText: '确定', //确认按钮名称
				cancelText: '取消',//取消按钮名籍我
				dateOrder: 'yyyymmdd', //面板中日期排列格式
				
				dayText: '日', 
				monthText: '月', 
				yearText: '年', //面板中年月日文字
				
				showNow: false,
				
		        nowText: "今",
		        startYear:currYear-100,
		        endYear:currYear + 100,
		        onSelect:function(){
		        	console.log($('#birthday').val());
		        }
			};
			$('#birthday').mobiscroll().date(opt);
		}
	
		$(function(){
			birthday();
			$("#accountManager .checkbox").click(function(){
				$(this).addClass("checked").siblings().removeClass("checked");
				$("input[name='sex']")[0].removeAttribute("checked");
				$("input[name='sex']")[1].removeAttribute("checked")
				$(this).find('input').attr("checked","checked");
			});
			$("#regMT-btn").click(function() {
				var parentMobile = $("#parentMobile").val();
				if(!checkPhone(parentMobile)){
					if(parentMobile == '') alert('请填写手机号码');
					else alert('输入的手机号码不正确');
					return false;
				}
				var vaildCode = $("#validCode").val();
				if("${parent.parentMobile}" != parentMobile && vaildCode.trim() == '') {
					alert('请输入验证码');
					return;
				}
				$.ajax({
					url : basePath + "/parent/update",
					type : 'POST',
					data : $('#accountForm').serialize(),
					error : function() {
						alert('系统异常');
					},
					success : function(data) {
						if(data.code != '000') {
							alert(data.msg);
							return;
						}
						window.location.reload();
					}
				});
			});
			$("#getValidCode").click(function() {
				var parentMobile = $("#parentMobile").val();
				if(!checkPhone(parentMobile)){
					if(parentMobile == '') alert('请填写手机号码');
					else alert('输入的手机号码不正确');
					return false;
				}
				$.ajax({
					url : basePath + "/sendSms",
					type : 'POST',
					data : {
						mobile: parentMobile
					},
					error : function() {
						alert('系统异常');
					},
					success : function(data) {
						if(data.code != '000') {
							alert(data.msg);
							return;
						}
						timeDJS($("#getValidCode"));
					}
				});
			});
		})
		function timeDJS(thiz){
			var wait = 60;		
			time(thiz); 
			function time(thiz) {  
			    if (wait == 0) {  
			    	$(thiz).attr('disabled',false);      
			    	thiz.val("获取验证码");    
			        wait = 60;  
			    } else {  
			    	$(thiz).attr('disabled',true);
			    	thiz.val("倒计时"+wait+"秒");  
			        wait--;  
			        setTimeout(function() {  
			            time(thiz);
			        },1000);  
				}  
			}
		}
	</script>
</body>
</html>